.image-container {
  width: 100%;
  position: relative;

  .url {
    position: absolute;
    bottom: 0;
    left: 50%;
    transform: translate(-50%, 0);
    color: #00308f;
    background-color: #8a8a8a80;
  }

  .image-odd {
    width: 100%;
    transition: all 0.5s ease-in-out;

    &:hover {
      transform: scale(1.2) translate(-30px, -20px) rotate(-10deg);
    }
  }

  .image-even {
    width: 100%;
    transition: all 0.5s ease-in-out;

    &:hover {
      transform: scale(1.2) translate(30px, -20px) rotate(10deg);
    }
  }
}


.title {
  margin-top: 50px;
  font-size: 30px;
  position: relative;
  font-weight: bold;
  text-align: center;

  &:hover &::after {
    border-color: #25b09b;
  }

  &::after {
    content: "";
    width: 200px;
    border-bottom: 2px solid #ccc;
    position: absolute;
    left: 50%;
    bottom: -10px;
    transform: translate(-50%, 0);
    animation: borderChange 5s linear infinite;
  }
}
